{{left_sidebar_enabled = False
  right_sidebar_enabled = False}}
{{extend 'layout.html'}}

<!-- load dojo and provide config via data attribute -->
<script src="{{=URL('static','dojo/dojo/dojo.js')}}" data-dojo-config="async: true"></script>

<style type="text/css">
	button{
		margin-left: 30px;
	}
	
	label{
		width: 100px;
		display: inline-block;
	}
	
	#btnver{
		margin-left: 10px;
	}
	
	.escondido		{ display: none; }
	
	.visible		{ visibility: visible; }
	
</style>


<script type="text/javascript">

require(
	["dojo/ready", 
	"dojo/dom",
	"dojo/on",
	"dijit/layout/AccordionContainer", 
	"dijit/layout/ContentPane",
	"dojo/_base/xhr", 
	"dojo/_base/declare",
	"dojo/store/Memory", 
	"dojo/store/Observable", 
	"dgrid/Grid", 
	"dgrid/extensions/Pagination",
	"dgrid/Selection", 
	"dgrid/Keyboard", 
	"dgrid/GridFromHtml",
	"dojo/_base/lang", 
	"dojo/dom-construct", 
	"dojo/dom-form", 
	"dojo/_base/array", 
	"dojo/json",
	"dijit/Dialog",
	"dojo/dom-class",
	"dojo/domReady!"], 
function(
	ready, 
	dom,
	on,
	AccordionContainer, 
	ContentPane,
	xhr,
	declare,
	Memory, 
	Observable, 
	Grid, 
	Pagination, 
	Selection, 
	Keyboard, 
	GridFromHtml,
	lang,
	domConstruct, 
	domForm,
	arrayUtil,
	json,
	Dialog,
	domClass)
	{
    ready(function(){
        var aContainer = new AccordionContainer({style:"height: 300px"}, "markup");
        aContainer.addChild(new ContentPane({
            title: "<label>N&uacute;mero</label>",
            content: 'Ingresar el n&uacute;mero de consulta. </br><input id="numero"></input><button id="btnumero">Buscar</button><button id="bthistorial">Ver Historial</button>'
        }));
        aContainer.addChild(new ContentPane({
            title: "<label>Nombre</label>",
            content: 'Ingresar el nombre.</br><input id="nombre"></input><button id="btnombre">Buscar</button><br>(No hace falta que sea el nombre completo)'
        }));
        aContainer.addChild(new ContentPane({
            title: "<label>Telefono</label>",
            content: 'Ingresar el tel&eacute;fono del consultante. </br><input id="telefono"></input><button id="bttelefono">Buscar</button>'
        }));
        aContainer.addChild(new ContentPane({
            title: "<label>Mail</label>",
            content: 'Ingresar el mail del consultante. </br><input id="mail"></input><button id="btmail">Buscar</button>'
        }));
        aContainer.addChild(new ContentPane({
            title: "<label>CUIL</label>",
            content: 'Ingresar el cuil del afiliado. </br><input id="cuil"></input><button id="btcuil">Buscar</button>'
        }));
        aContainer.addChild(new ContentPane({
            title: "<label>CUIT</label>",
            content: 'Ingresar el cuit del empleador o prestador. </br><input id="cuit"></input><button id="btcuit">Buscar</button>'
        }));
        aContainer.startup();
        
        rows = 0;
        data_list = [];
        
        //la grilla se carga vacia
		data = {
			identifier: 'numero',
			label: 'numero',
			items: []
		};
		
		for(var i=0, l=data_list.length; i<rows; i++){
			data.items.push(lang.mixin({ id: i }, data_list[i%l]));
		}

		var testStore = Observable(new Memory({data: data}));
		var CustomGrid = declare([Grid, Keyboard, Selection, Pagination]);
			
		getColumns2 = function(){
				return {
				fecha: 'Fecha',
				numero: 'Numero',
				nombre: 'Nombre',
				tipo: 'Tipo',
				consulta: 'Consulta',
				subconsulta: 'Subconsulta',
				comentario: 'Comentario'
				};
		};	
			
		window.grid = new CustomGrid({
				store: testStore,
				cellNavigation: false,
				selectionMode: "single",
				columns: getColumns2(),
				pagingLinks: false,
				pagingTextBox: false,
				firstLastArrows: true,
				pageSizeOptions: [10, 30, 50]
				}, "grid");
				
		//handler del evento de seleccionar una fila de la grilla
        grid.on("dgrid-select", //,dgrid-deselect",
			function(event){
				if(event.type == "dgrid-select"){
					xhr.get({
						url: '{{=URL(r = request, c = "utils", f="info_consulta")}}',
					handleAs: "text",
						content: {
						numero:event.rows[0].id
						//numero: arrayUtil.map(event.rows, function(row){ return row.id; })
					},
					load: function(response) {
						myDialog = new Dialog({
							title: "Informacion de la consulta",
							content: response,
							style: "width: 500px"
						});	        
						myDialog.show();
							        
						}
					});
				}
				
			}
		);
        
        cargar_grilla = function(data_list, rows){    	
			//se cargan datos a la grilla
			data = {
				identifier: 'numero',
				label: 'numero',
				items: []
			};
			for(var i=0, l=data_list.length; i<rows; i++){
				data.items.push(lang.mixin({ id: i }, data_list[i%l]));
			}
			// global var testStore
			testStore = Observable(new Memory({data: data}));
			grid.setStore(testStore);
			grid.refresh();					
		};
        
        buscar = function(field, value){
        	xhr.get({
				// URL de la request
				url: "load_consultas",
				handleAs: "json",
				content: {
					field: field,
					value: value
				},
				load: function(response) {
					cargar_grilla(response.data_list, response.rows);
				}
			});
        }
        
        buscar_por_numero = function(){
        	buscar("numero", numeroNode.value);
        }
        buscar_por_nombre = function(){
        	buscar("nombre", nombreNode.value);
        }
        buscar_por_telefono = function(){
        	buscar("telefono", telefonoNode.value);
        }
        buscar_por_mail = function(){
        	buscar("mail", mailNode.value);
        }
        buscar_por_cuil = function(){
        	buscar("cuil", cuilNode.value);
        }    
        buscar_por_cuit = function(){
        	buscar("cuit", cuitNode.value);
        }
        buscar_historial = function(){
        	xhr.get({
				// URL de la request
				url: "obtener_historial",
				handleAs: "text",
				content: {
					consulta: numeroNode.value
				},
				load: function(response) {
					myDialog = new Dialog({
							title: "Historial",
							content: response,
							style: "width: 500px"
						});	        
						myDialog.show();
							        
				}
			});
        }
        
        var btnumeroNode = dom.byId("btnumero");
        var btnombreNode = dom.byId("btnombre");
        var bttelefonoNode = dom.byId("bttelefono");
        var btmailNode = dom.byId("btmail");
        var btcuilNode = dom.byId("btcuil");
        var btcuitNode = dom.byId("btcuit");
        var bthistorialNode = dom.byId("bthistorial");
        var numeroNode = dom.byId("numero");
        var nombreNode = dom.byId("nombre");
        var telefonoNode = dom.byId("telefono");
        var mailNode = dom.byId("mail");
        var cuilNode = dom.byId("cuil");
        var cuitNode = dom.byId("cuit");
        
        
        on(btnumeroNode, "click", buscar_por_numero);
        on(btnombreNode, "click", buscar_por_nombre);
        on(bttelefonoNode, "click", buscar_por_telefono);
        on(btmailNode, "click", buscar_por_mail);
        on(btcuilNode, "click", buscar_por_cuil);
        on(btcuitNode, "click", buscar_por_cuit);
        on(bthistorialNode, "click", buscar_historial);

    });
});
    	
</script>

{{=form}}



